<template>
    <div>
        <p>============孙组件start============</p>
        {{ name }} 
        <p>============组件end============</p>  
    </div>
</template>

<script>
// var CompA = {
//     data() {
//         return {
//             name: 'extendsA',
//         };
//     },
// }
var CompB = {
    data() {
        return {
            name: 'extendsB',
        };
    },
    methods: {
        fn() {
            console.log('extendsB-fn');
        },
    },
    created() {
        // console.log('extendsB');
    },
}
var mixins2 = {
    data() {
        return {
            name: 'mixins2-name',
        };
    },
    methods: {
        fn() {
            console.log('mixins2-fn');
        },
    },
    created() {
        // console.log('mixins2-created');
    },
}
var mixins4 = {
    data() {
        return {
            name: 'mixins4-name',
        };
    },
    methods: {
        fn() {
            console.log('mixins4-fn');
        },
    },
    created() {
        // console.log('mixins4-created');
    },
}
// import { mixins3 } from '@/utils/mixin'
// import ZiZi from './ZiZi.vue';
export default {
    name: 'HelloWorldSunSun',
    extends: CompB,
    mixins: [ mixins2,mixins4],
    data() {
        return {
            SunMsg: '孙组件'
        };
    },
    created() {
        // console.log('孙组件');
        // this.$on(['formSun', 'formSun2'], (value) => {
        //     console.log('sun page $on:', value);
        //     this.$off('formSun1')
        // })
        //   this.$once('formSun',(value)=>{
        //     console.log('sun page $once:',value);
        //   })
    },
    methods: {
        // fn() {
        //     console.log('component-fn');
        // }
    }
};
</script>
